<template>
	<view style="padding: 20px;">
		<!-- log打印 -->
		<button @click="onLog()">conslose.log</button>
		<button @click="onDebug()">conslose.debug</button>
		<button @click="onInfo()">conslose.info</button>
		<button @click="onWarn()" type="warn" style="background-color: yellow;color: black;">conslose.warn</button>
		<button @click="onError()" style="background-color: red;">conslose.error</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: '打印日志',
				pwd: 123456
			}
		},
		methods: {
			onLog() {
				// 常规写法
				// 第一个参数为任意类型，第二个为数据数组，用+时为字符串拼接
				console.log("onLog()-->" + this.title);
				
				// clog自动补全console.log
				// console.log("clog");
				
				// clogv
				console.log('this.title: ',this.title,this.pwd);
			},
			
			onWarn() {
				console.warn("这是警告");
			},
			
			onError() {
				console.error("这是错误");
			},
			
			onDebug() {
				console.debug("这是debug日志，编译时自动过滤");
			},
			
			onInfo() {
				console.info("this is info log")
			}
		}
	}
</script>

<style>
button{
	margin: 10px;
}
</style>
